<script setup lang='ts'>
import {
  Document,
  Menu as IconMenu,
  Location,
  Setting,
} from '@element-plus/icons-vue'

const activeIndex = ref('1')
const menuList = ref([{
    path: '/demo',
    name: 'demo1',
}])
</script>
<template>
    <el-scrollbar class="menu-nav">
            <!-- <router-link to="/user">我的合同</router-link> -->
        <el-menu
            :default-active="activeIndex"
            class="menu-nav-content"
        >
            <!-- <el-sub-menu index="1">
                <template #title>
                    <el-icon><location /></el-icon>
                    <span>demo</span>
                </template>
                <el-sub-menu index="1-4">
                    <template #title>Demo1</template>
                        <el-menu-item index="2-4-1">
                            <router-link to="/demo1">demo1</router-link>
                        </el-menu-item>
                </el-sub-menu>
                <el-menu-item index="1-3">
                    <router-link to="/demo1">demo1</router-link>
                </el-menu-item>
                <el-menu-item index="2">
                    <el-icon><icon-menu /></el-icon>
                    <router-link to="/demo2">demo2</router-link>
                </el-menu-item>
            </el-sub-menu> -->
            <el-menu-item class="nav-item" index="1">
                <!-- <el-icon><setting /></el-icon> -->
                <router-link to="/my-contract">我的合同</router-link>
            </el-menu-item>
        </el-menu>
    </el-scrollbar>
</template>
<style lang="scss" scoped>
.menu-nav {
    width: 180px;
    padding: 8px 0;
    background-color: #fff;
    .menu-nav-content {
        border: none;
    }
    .nav-item {
        height: 40px;
        border-left: 3px solid #DA0004;
        text-align: center;
        font-size: 16px;
        line-height: 40px;
        background-color: #FFF0F0;
        color: #DA0004;
        font-weight: 600;
        box-sizing: border-box;
        padding: 0!important;
        > a {
            width: 100%;
            height: 100%;
        }
    }
}
</style>